<template>
  <div class="setting121">
    <div class="fanhuiljy11" @click="ljy11">
      <van-icon name="arrow-left"></van-icon>
    </div>
    <!--    标题-->
    <div class="shezhi">
      <font>{{ $t('setting') }}</font>
    </div>
    <!--    多语言-->
    <div class="duoyuyan">
      <div class="duoyuyan1">
        <font>{{ $t('multilingual') }}</font>
      </div>
      <div class="xuanze1">
        <van-button class="chinse111" @click="changeLanguage">
          {{ $t('chinse') }}
        </van-button>
      </div>
    </div>
<!--   定位功能 -->
    <div class="dingwei">
      <div class="dingwei1">
        <font>{{ $t('postion') }}</font>
      </div>
      <div class="xuanze2">
        <van-switch v-model="locationStatus" @click="updateOption()"/>
      </div>
    </div>
<!--    消息通知-->
    <div class="xiaoxitongzhi">
      <div class="xiaoxitongzhi1">
        <font>{{ $t('message') }}</font>
      </div>
      <div class="xuanze3">
        <van-switch v-model="notificationStatus" @click="updateNotification()"/>
      </div>
    </div>
<!--    手机剪切板权限-->
    <div class="shouji">
      <div class="shouji1">
        <font>{{ $t('clippingBoard') }}</font>
      </div>
      <div class="xuanze4">
        <van-switch v-model="plateStatus" @click="updateStatus2()"/>
      </div>
    </div>
<!--    免密支付设置-->
<!--    服务协议与规则-->
    <div class="fuwuxieyi">
      <div class="fuwuxieyi1">
        <font>{{ $t('serve') }}</font>
      </div>
    </div>
<!--    给我们评价-->
    <div class="giveup">
      <div class="giveup1">
        <font>{{ $t('evaluate') }}</font>
      </div>
    </div>
<!--    清理缓存-->
    <div class="clear">
      <div class="clear1">
        <van-button type="text" @click="showClearCache" class="clear1111">{{ $t('clean') }}</van-button>
        <van-dialog
            v-model="show"
            title="确认清理缓存？"
            show-cancel-button
            @confirm="clearCache"
            :center="true"
            class="tanchukuang1234"
        >
          清理缓存后将无法恢复，请谨慎操作。
        </van-dialog>
      </div>
    </div>
    <BottomPanel/>
  </div>
</template>

<script>
import BottomPanel from "@/views/bottomPanel.vue";
import  {updateStatus2,updateStatus3,updateStatus4,updateStatus5,updateStatus6,updateStatus7} from "@/api/personal/personal";
import { Toast } from 'vant';
export default {
  data() {
    return {
      show: false,
      id:1,
      checked1:false,
      passwordFreeStatus:'',
      plateStatus:false,
      locationStatus:false,
      notificationStatus:false,
    }
  },
  created() {
    this.updateStatus2
    this.updateOption
  },
  components: {BottomPanel},
  methods: {
    //清理缓存的弹窗
    showClearCache() {
      this.show = true;
    },
    clearCache() {
      localStorage.clear();
      sessionStorage.clear();
      // 这里可以添加其他清理逻辑，比如清理 IndexDB 或 WebSQL
      this.show = false;
      this.$toast('缓存已清理');
    },
    //国际化
    changeLanguage() {
      this.$i18n.locale = this.$i18n.locale === 'en' ? 'zh' : 'en';
    },
    updateStatus2(){
      console.log(this.plateStatus)
      if (this.plateStatus==false)
      {
        updateStatus2(this.id).then(res => {
          console.log(res)
          if (res=== 1)
            Toast.success('开启成功')
        })
      }
      else{
        updateStatus3(this.id).then(res => {
          console.log(res)
          if (res=== 1)
            Toast.success('关闭成功')
        })
      }
    },
    updateOption(){
      console.log(this.locationStatus)
      if (this.locationStatus==false)
      {
        updateStatus4(this.id).then(res => {
          console.log(res)
          if (res=== 1)
            Toast.success('开启成功')
        })
      }
      else{
        updateStatus5(this.id).then(res => {
          console.log(res)
          if (res=== 1)
            Toast.success('关闭成功')
        })
      }
    },
    updateNotification(){
      console.log(this.notificationStatus)
      if (this.notificationStatus==false)
      {
        updateStatus6(this.id).then(res => {
          console.log(res)
          if (res=== 1)
            Toast.success('开启成功')
        })
      }
      else{
        updateStatus7(this.id).then(res => {
          console.log(res)
          if (res=== 1)
            Toast.success('关闭成功')
        })
      }
    },
    ljy11(){
      this.$router.push({path: '/personalHome'})
    }
  }
}
</script>


<style>
.shezhi{
  width: 100%;
  height: 50px;
  line-height: 50px;
  text-align: center;
  border-bottom: darkgray 1px dashed;
}
.duoyuyan{
  width: 100%;
  height: 70px;
  line-height: 70px;
  border-bottom: darkgray 1px dashed;
  margin-left: 1%;
}
.duoyuyan1{
  display: inline-block;
  height: 70px;
  line-height: 70px;
  margin-left: 10px;
}
.xuanze1{
  height: 70px;
  line-height: 70px;
  display: inline-block;
  margin-left:30%;
}
.dingwei{
  margin-left: 1%;
  width: 100%;
  height: 70px;
  line-height: 70px;
  border-bottom: darkgray 1px dashed;
}
.dingwei1{
  display: inline-block;
  height: 70px;
  line-height: 70px;
  margin-left: 10px;
}
.xuanze2{
  height: 70px;
  line-height: 70px;
  display: inline-block;
  margin-left:53%;
}
.xiaoxitongzhi{
  margin-left: 1%;
  width: 100%;
  height: 70px;
  line-height: 70px;
  border-bottom: darkgray 1px dashed;
}
.xiaoxitongzhi1{
  display: inline-block;
  height: 70px;
  line-height: 70px;
  margin-left: 10px;
}
.xuanze3{
  height: 70px;
  line-height: 70px;
  display: inline-block;
  margin-left:53%;
}
.shouji{
  margin-left: 1%;
  width: 100%;
  height: 70px;
  line-height: 70px;
  border-bottom: darkgray 1px dashed;
}
.shouji1{
  display: inline-block;
  height: 70px;
  line-height: 70px;
  margin-left: 10px;
}
.xuanze4{
  height: 70px;
  line-height: 70px;
  display: inline-block;
  margin-left:41%;
}
.fuwuxieyi{
  margin-left: 1%;
  width: 100%;
  height: 70px;
  line-height: 70px;
  border-bottom: darkgray 1px dashed;
}
.fuwuxieyi1{
  display: inline-block;
  height: 70px;
  line-height: 70px;
  margin-left: 10px;
}
.xuanze6{
  height: 70px;
  line-height: 70px;
  display: inline-block;
  margin-left:52%;
}
.giveup{
  margin-left: 1%;
  width: 100%;
  height: 70px;
  line-height: 70px;
  border-bottom: darkgray 1px dashed;
}
.giveup1{
  display: inline-block;
  height: 70px;
  line-height: 70px;
  margin-left: 10px;
}
.xuanze7{
  height: 70px;
  line-height: 70px;
  display: inline-block;
  margin-left:60%;
}
.clear{
  margin-left: 1%;
  width: 100%;
  height: 70px;
  line-height: 70px;
  border-bottom: darkgray 1px dashed;
}
.clear1{
  display: inline-block;
  height: 70px;
  line-height: 70px;
  margin-left: 10px;
}
.xuanze8{
  height: 70px;
  line-height: 70px;
  display: inline-block;
  margin-left:55%;
}
.clear1111{
  border: white;
  width: 100px;
  height: 50px;
  background-color: white;
}
.chinse111{
  border: white;
  width: 100px;
  height: 40px;
  background-color: white;
}
.setting121{
  width: 100%;
  height: 90vh;
}
.tanchukuang1234{
  text-align: center;
}
.fanhuiljy11{
  line-height: 20px;
}
</style>